<template>
	<view class="content">
		<view class="goods-list">

			<u-swipe-action >
				<u-swipe-action-item :options="options1" v-for="(item, index) in favlist" @click="rem(index)">
					<view class="goods-item" @click="navTo(`/pages/product/product?goods_id=${item.goods_id}`)">
						<!-- <cl-list-item swipe="right"> -->
						<view class="image-wrapper">
							<image :src="item.img" mode="widthFix"></image>
						</view>
						<view class="price-box">
							<text class="title">{{item.name}}</text>
							<text class="price">{{item.price}}</text>
						</view>

						<!-- <view class="append" slot="menu"><button type="warn" class="error-btn">删除</button></view> -->
						<!-- </cl-list-item> -->
					</view>

				</u-swipe-action-item>
			</u-swipe-action>
		</view>
		<u-modal @cancel="show=false" @confirm="shan" :show="show" :showCancelButton='true' :title="title">确认删除收藏吗</u-modal>
		<lc-loading :status="loading"></lc-loading>
	</view>
</template>

<script>
	import {
		get_fav_list,
		toggle_fav
	} from '@/api/index.js'
	export default {
		data() {
			return {
				favlist: [],
				show1: true,
				limit: 10,
				loading: 'more',
				options1: [{
					text: '删除',
					style: {
						backgroundColor: '#fff',
						padding: '5px',
						color: 'red',

					}
				}],
				show: false,
				title: '温馨提示',
				num:0
			}
		},
		onReachBottom() {
			if (this.loading == 'finished') return
			this.getfav_list()
		},
		onLoad() {
			this.getfav_list()
		},
		methods: {
			//remore
			shan(){
				let uid = uni.getStorageSync('uid')
				let is_fav = 1
				let goods_id = this.favlist[this.num].goods_id
				toggle_fav({uid,is_fav,goods_id}).then(res=>{
					if(res.code==1){
						console.log(res)
						// this.getfav_list()
						this.favlist.splice(this.num,1)
						this.show=false
						this.$u.toast(res.msg)
					}
				})
			},
			//打开弹窗
			rem(index){
				// console.log(123)
				this.show=true
				this.num=index
			},
			//关闭弹窗
			close() {
				this.show = false
				// console.log('close');
			},
			getfav_list() {
				this.loading = 'loading'
				let {
					limit,
					favlist
				} = this
				let uid = uni.getStorageSync('uid')
				let skip = favlist.length
				get_fav_list({
					uid,
					limit,
					skip
				}).then(res => {
					
					if (res.code == 1) {
						this.favlist.push(...res.data)
						let len = res.count
						if (favlist.length >= len) {
							this.loading = 'finished'
						} else {
							this.loading = 'loading'
						}
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	page,
	.content {
		background: $page-color-base;
	}

	/* 商品列表 */
	.goods-list {
		display: flex;
		flex-wrap: wrap;
		padding: 0 30upx;
		background: #fff;

		.goods-item {
			display: flex;
			padding: 20upx 0;
			border-bottom: 1px solid #eee;

		}

		.image-wrapper {
			width: 200rpx;
			height: 200rpx;
			border-radius: 3px;
			overflow: hidden;

			image {
				width: 200rpx;
				height: 200rpx;
				opacity: 1;
			}
		}

		.title {
			font-size: $font-lg;
			color: $font-color-dark;
			line-height: 50upx;
		}

		.price-box {
			font-size: 24upx;
			color: $font-color-light;
			flex: 1;
			padding-left: 10px;
			display: flex;
			flex-wrap: wrap;
		}

		.price {
			font-size: $font-lg;
			color: $uni-color-primary;
			line-height: 1;

			&:before {
				content: '￥';
				font-size: 26upx;
			}
		}
	}
</style>
